<template>
  <view>
    <view class="wrap">
      <view
        class="exam_wrap"
        v-for="(item, index) in exam"
        :key="index"
        @click="startTest(can_exam, item)"
      >
        <image src="@/pageCourse/static/images/contents_icon_test.png" class="img"></image>
        <!-- <view class="text-name u-line-1" :class="[item.can_exam==1?'':'GrayColor']">{{item.paper_title}}</view> -->
        <view class="text-name u-line-1 GrayColor" v-if="can_exam == 0">{{
          item.paper_title
        }}</view>
        <view class="text-name u-line-1" v-else :class="[item.can_exam == 1 ? '' : 'GrayColor']">{{
          item.paper_title
        }}</view>
      </view>
    </view>
    <edu-empty v-if="$u.test.empty(exam)"></edu-empty>
    <edu-user-coupon></edu-user-coupon>
  </view>
</template>

<script>
export default {
  props: {
    can_exam: {
      type: [String, Number],
    },
    exam: {
      type: Array,
    },
    is_buy: {
      type: [String, Number],
    },
    course_id: {
      type: [String, Number],
    },
  },
  methods: {
    startTest(type, data) {
      this.$edu.judgeLogin(() => {
        if (this.is_buy == 0) {
          this.$u.toast('不符合参考条件')
          return
        }
        if (data.can_exam == 0) {
          this.$u.toast('考试次数已用完')
          return
        }
        if (type == 1) {
          this.$u.route('pageFound/exam/paper/topic', {
            id: data.paper_id,
            course_id: this.course_id,
          })
        } else {
          this.$u.toast('不符合参考条件')
        }
      })
    },
  },
}
</script>

<style lang="scss" scoped>
.wrap {
  padding: 0 30rpx;
}
.exam_wrap {
  height: 87rpx;
  width: 100%;
  display: flex;
  align-items: center;
  .img {
    height: 32rpx;
    width: 64rpx;
  }
  .text-name {
    font-size: 28rpx;
    color: #606266;
    margin-left: 15rpx;
  }
  .GrayColor {
    color: #909399 !important;
  }
}
</style>
